<template>

	<view class="main-container">

		<view class="smart-container">容器</view>
		<view class="smart-panel-title" @click="naviTo('view')"><text>视图view</text></view>
		<view class="smart-panel-h" @click="naviTo('scroll')"><text>滚动视图 scroll-view</text></view>
		<view class="smart-panel-h" @click="naviTo('swiper')"><text>可滑动视图 swiper</text></view>
		
		
		
		<view class="smart-container">基础内容</view>
		<view class="smart-panel-title" @click="naviTo('text')"><text>文本编辑</text></view>
		<view class="smart-panel-h" @click="naviTo('rich-text')"><text>rich-text富文本编辑</text></view>
		<view class="smart-panel-h" @click="naviTo('progress')"><text>progress进度条</text></view>
		
		
		
		
		<!-- 3. 表单组件 -->
				<view class="smart-container">
					<text class="item-title">
						3. 表单组件
					</text>
				</view>
				
				<!-- 【添加这里】 -->
				<view class="item-obj" @click="naviTo('button')">
					<text>1. button</text>
				</view>
				<view class="item-obj" @click="naviTo('radio')">
					<text>2. radio</text>
				</view>
				<view class="item-obj" @click="naviTo('checkbox')">
					<text>3. checkbox</text>
				</view>
				<view class="item-obj" @click="naviTo('input')">
					<text>4. input</text>
				</view>
				<view class="item-obj" @click="naviTo('picker')">
					<text>5. picker</text>
				</view>
				
				<!-- 剩下的组件先放着，但不可点 -->
				<view class="item-obj-disabled">
					<text>6. slider</text>
				</view>
				<view class="item-obj-disabled">
					<text>7. switch</text>
				</view>
				<view class="item-obj-disabled">
					<text>8. textarea</text>
				</view>
				<view class="item-obj-disabled">
					<text>9. form</text>
				</view>
	</view>
	
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			naviTo(e){
				uni.navigateTo({
					url:"/pages/compontnts/" + e + "/" + e
				});
			}
		
			
		}
	}
</script>

<style>
	@import'../../../static/css/smart.css'
</style>